<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title><%= web_title%></title>
    <link rel="stylesheet" href="/libs/Tree/layui_ext/dtree/dtree.css">
    <link rel="stylesheet" href="/libs/Tree/layui_ext/dtree/font/dtreefont.css">
    <link rel="stylesheet" href="/layuiadmin/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="/layuiadmin/style/admin.css" media="all">
    <link rel="stylesheet" href="/ruoling/css/ruoling-ui.css">
    <link rel="stylesheet" href="/ruoling/css/ruoling-load.css">
</head>
<style>
    /* chrome */
    input::-webkit-outer-spin-button,
    input::-webkit-inner-spin-button {
        -webkit-appearance: none;
    }
    /* 火狐浏览器 */
    input[type="number"] {
        -moz-appearance: textfield;
    }
    .Yiling-flexd{position: fixed;bottom: 0;background-color: #f0f4f7;width: 100%;border-top: 1px #c7c7c7 solid;text-align: right;}
    .Yiling-padding{padding: 20px 15px;}
    .Yiling-border-blue{border: 1px solid #0064b6;}
    .Yiling-border-block{border: 1px solid #000;}
    .Yiling-Body{background-color: #ffffff;}
    .Yiling-padding-bottom{padding-bottom: 15px;}
    .Yiling-seach{display: inline-block;height: 36px;border: 1px solid #e5e6e7;vertical-align: top;line-height: 36px;width: 36px;text-align: center;margin-left: -6px;border-top-right-radius: 5px;border-bottom-right-radius: 5px;cursor: pointer;}
    .Yiling-tree-border{border: 1px solid #e5e6e7;border-radius: 4px;padding: 2px;overflow-y: auto;height: 250px;}
</style>
<body class="Yiling-Body">
<form class="layui-form" action="">
    <div style="padding:20px 20px;">
        <div class="Yiling-padding-bottom">
            <label class="layui-form-label" style="width: 190px;"><i style="color: red;">*  </i>角色名称：</label>
            <div style="width: 300px;display: inline-block;">
                <input type="text" name="sys_role_name" value="<%= data.role_data.sys_role_name%>"  required  lay-verify="required" placeholder="请输入角色名称" autocomplete="off" class="layui-input">
            </div>
        </div>
        <input type="hidden" name="ID" value="<%= data.role_data.ID%>" />
        <div class="Yiling-padding-bottom">
            <label class="layui-form-label" style="width: 190px;"><i style="color: red;">*  </i>显示排序：</label>
            <div style="width: 300px;display: inline-block;">
                <input type="number" name="sys_role_sort" onmousewheel="return false;"  value="<%= data.role_data.sys_role_sort%>"  required  lay-verify="required" placeholder="请输入显示排序" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="Yiling-padding-bottom">
            <label class="layui-form-label" style="width: 190px;"><i style="color: red;">*  </i>角色状态：</label>
            <div style="width: 300px;display: inline-block;">
                <%if(data.role_data.sys_role_state == 1){%>
                    <input type="checkbox" name="sys_role_state" value="1" title="开启" checked>
                <%}else{%>
                    <input type="checkbox" name="sys_role_state" value="1" title="开启">
                <%}%>
            </div>
        </div>
        <div class="Yiling-padding-bottom">
            <label class="layui-form-label" style="width: 190px;"><i style="color: red;">*  </i>菜单权限：</label>
            <div style="width: 300px;display: inline-block;vertical-align: top;padding-top: 10px;padding-bottom: 50px;">
                <div class="Yiling-tree-border">
                    <ul id="objTree" class="dtree" style="padding-top: 5px;" data-id="0"></ul>
                </div>
            </div>
        </div>
    </div>
    <div class="Yiling-flexd">
        <div class="Yiling-padding">
            <button type="button"  lay-submit lay-filter="formDemo"  class="layui-btn layui-btn-sm Yliing-blue Yiling-border-blue">确认</button>
            <button type="button" id="Yiling-close" class="layui-btn layui-btn-sm layui-btn-primary  Yiling-border-block">关闭</button>
        </div>
    </div>
</form>
</body>
</html>
<script src="/layuiadmin/layui/layui.js"></script>
<script>
    layui.config({
        base:""
    }).extend({
        dtree:"/libs/Tree/layui_ext/dtree/dtree",
        Yiling:"/libs/ruoling-request/js/Yiling-Request"
    }).use(["table","layer","jquery","form","dtree","Yiling"],function(){
        let table = layui.table;
        let layer = layui.layer;
        let $ = layui.jquery;
        let form = layui.form;
        let dtree = layui.dtree;
        let request = layui.Yiling.YI_Ajax;

        dtree.render({
            elem:"#objTree",
            dataStyle: "layuiStyle",  //使用layui风格的数据格式
            method: "get",
            dataFormat: "list",  //配置data的风格为list
            checkbar: true,
            response:{message:"msg",statusCode:0},  //修改response中返回数据的定义
            checkbarType: "all", // 默认就是all，其他的值为： no-all  p-casc   self  only
            url:"/admin/v1/api/role/menuchecktree",
            done:function(res,$ul,first){
                dtree.chooseDataInit("objTree",'<%= data.menu_data_id%>')
                //  console.log('<%= data.menu_data_id%>')
            }
        });

        //监听提交
        form.on('submit(formDemo)', function(data){
            var params = dtree.getCheckbarNodesParam("objTree");

            if(params.length == 0){
                layer.msg("请选择菜单")
                return false;
            }
            layer.confirm('是否确认修改', {icon: 3, title:'提示'}, function(index){
                let arrid = [];
                for(let i = 0;i<params.length;i++){
                    arrid.push(parseInt(params[i].nodeId));
                }
                data.field.sys_role_state = data.field.sys_role_state == undefined ? 0 : 1;
                let obj = {
                    sys_role_state: data.field.sys_role_state,
                    sys_role_name:data.field.sys_role_name,
                    sys_role_sort:data.field.sys_role_sort,
                    arr_Id:arrid,
                    ID:data.field.ID,
                }
                new request().SetUrl("/admin/v1/api/role/edit").SetType("POST").SetDataPara(obj).Alone().Init(function(result){
                    parent.window.LoadTable();
                    ifaremClose();
                })
                layer.close(index);
            });
            return false;
        });

        // 关闭按钮事件
        let Yiling_close = document.querySelector("#Yiling-close");
        Yiling_close.addEventListener("click",function(){
            ifaremClose();
        });
        function ifaremClose(){
            //获取特定iframe层的索引
            let index = parent.layer.getFrameIndex(window.name);
            parent.layer.close(index);
        };
    })
</script>
<!-- 时间格式化 -->
<script type="text/html" id="SetDateCrete">
    {{FormDate(d.creationtime,"yyyy年MM月dd日 HH:mm:ss")}}
</script>
<script>
    function FormDate(d,str){
        return layui.util.toDateString(d, str)
    }

</script>